<template>
	<div id="audition_manage" class="container">
		<div class="content">
			<!-- <div class="title">{{title}}</div> -->
			<div class="nav_div">
				<div class="nav" :class="pageType==0? 'nav_active':''" @click="selectType(0)">试听班级</div>
				<div class="nav" :class="pageType==1? 'nav_active':''" @click="selectType(1)">试听记录</div>
				<div class="nav" :class="pageType==2? 'nav_active':''" @click="selectType(2)">考勤记录</div>
			</div>
			<!-- 试听班级 -->
			<div v-if="pageType==0" style="margin-top:0.16rem;">
				<div class="condition">
					<!--<el-select class="select" v-model="param.classStatusMode" 
						placeholder="班级状态" @change="search()" clearable>
						<el-option v-for="item in classStatus" :key="item.value"
								:label="item.name" :value="item.value">
						</el-option>
					</el-select>-->
					
					<!--<el-select class="select" v-model="param.classroomId"
						placeholder="教室" @change="search()" clearable>
						<el-option v-for="item in classroomList" :key="item.classroomId"
								:label="item.name" :value="item.classroomId">
						</el-option>
					</el-select>
					
					<el-select class="select" v-model="param.teachUserId" 
						placeholder="教师" @change="search()" clearable>
						<el-option v-for="item in userList" :key="item.userId"
								:label="item.nickName" :value="item.userId">
						</el-option>
					</el-select>-->
					
					<el-date-picker v-model="classTime" class="time_picker" @change="timeChange"
						align="center"  unlink-panels range-separator="至"
						start-placeholder="上课时间起" end-placeholder="上课时间止"
						value-format= "yyyy-MM-dd" type="daterange">
					</el-date-picker>
		
					<el-input v-model="param.keyword" placeholder="搜索 班级名/课程" 
						style="width: 3.15rem;" clearable maxlength="100">
					</el-input>
					&emsp;
					
					<div class="search_btn" @click="search()" v-if="hasApi('auditionList')">搜索</div>
					
					<div class="right_btn" v-if="hasApi('auditionAdd')" @click="openAdd()">新建试听</div>
				</div>
				<div class="panel" v-for="item in auditionList">
					<div class="panel_top">
						<div class="panel_mark">{{courseTypeMap[item.courseType]}}试听课</div>	
						<!--
						按钮权限
							1.报名 : 限制 未排课,已结课 的班级
							2.编辑 : 无限制
							3.课程表 : 无限制
							4.删除 : 限制 上课中 的班级
							5.排课 : 限制约了名师的双师课
							6.课节设置 : 在线课显示, 限制 未排课 的班级
							7.创建教室: 在线课显示, 限制 未排课 的班级
							8.约名师 : 双师课显示
							9.班级订单 : 双师课显示
						-->
						<div class="panel_btn signup_btn" v-if="hasApi('auditionEnroll')" @click="openEnroll(item)">报名</div>
						<div class="panel_btn edit_btn" v-if="hasApi('auditionUpdate')" @click="openEdit(item)">编辑</div>
						<div class="panel_btn schedule_btn" v-if="hasApi('auditionSyllabus')" @click="openTimetable(item)">课程表</div>
						<div class="panel_btn delete_btn" v-if="hasApi('auditionDelete')" @click="openDelete(item)">删除</div>
						<div class="panel_btn schedule_btn" v-if="hasApi('coursescheduling')" @click="classScheduling(item)">排课</div>
						<div class="panel_btn attend_btn" @click="openAttend(item)"
							v-if="[3,4].indexOf(item.syllabus.status)>=0 && hasApi('auditionAttend')">
							考勤
						</div>
						
						<!-- 在线课 -->
						<div class="panel_btn edit_btn" v-if="hasApi('auditionFileList') && item.courseType==5" @click="openSyllabus(item)">课节设置</div>
						<div class="panel_btn edit_btn" v-if="hasApi('createTalkyunRoom') && item.courseType==5" @click="openClassroom(item)">创建教室</div>
						<!-- 双师课 -->
						<div class="panel_btn delete_btn" @click="openTeacher(item.classId)"
							v-if="hasApi('savefeiboSyllabusTeacher') && item.courseType==4">约名师</div>
						<div class="panel_btn delete_btn" @click="openOrder(item)"
							v-if="hasApi('getfeiboSyllabusTeacherOrder') && item.courseType==4">班级订单</div>
					</div>
					
					<div class="panel_body">
						<div class="panel_one">
							<div>班级名称： <span class="panel_value_1">{{item.className}}</span></div>
							<div>课程名称： <span class="panel_value_2">{{item.courseName}}</span></div>
							<div>上课时间： <span class="panel_value_2">{{item.syllabus.time}}</span></div>
							<div class="more_time" v-if="hasApi('auditionSyllabus')" @click="openTimetable(item)">更多上课时间</div>
						</div>
						<div  class="panel_two">
							<div>教室： <span class="panel_value_2">{{item.syllabus.classroomName}}</span></div>
							<div>教师： <span class="panel_value_2">{{item.syllabus.teacherUserName}}</span></div>
							<div>助教： <span class="panel_value_2">{{item.syllabus.assisUserName}}</span></div>
						</div>
						<div class="panel_three">
							<div>班级状态</div>
							<div class="status" :style="{color: statusColor[item.syllabus.status]}">{{statusMap[item.syllabus.status]}}</div>
						</div>
						<div class="panel_four">
							<div>班级学员</div>
							<div class="student_num">
								<span class="student_now">{{item.syllabus.studentNum || 0}}</span>/{{item.recruitNum}}
							</div>
							<div class="remark">已有学员/计划招生</div>
						</div>
					</div>
					
					<div class="panel_bottom">
						<div class="table_div" hidden>
							<table class="table" cellspacing="0" v-show="item.studentList && item.studentList.length>0">
								<thead class="thead">
									<tr>
										<td style="width: 3rem;">学员</td>
										<td style="width: 3rem;">年龄</td>
										<td style="width: 3rem;">联系电话</td>
										<td style="width: 3rem;">试听课时</td>
										<td style="width: 3rem;">考勤</td>
										<td style="width: 3rem;">操作</td>
									</tr>
								</thead>
								<tbody class="tbody">
									<tr v-for="stu in item.studentList">
										<td>{{stu.realName}}</td>
										<td>{{stu.age}}</td>
										<td>{{stu.phone}}</td>
										<td>{{stu.classHour}}</td>
										<td>{{signinMap[stu.signinMode]||'未签到'}}</td>
										<td> 
											<span style="color: #2e83f6;cursor: pointer;" v-if="hasApi('auditionStuUpdate')&&stu.signinMode==0" @click="openTurnClass(stu, item)">
												转班
											</span>
										</td>
									</tr>
								</tbody>
							</table>
						</div>
						<div class="panel_bottom_btn" v-if="hasApi('auditionStudent')" @click="showStudent($event,item)"></div>
					</div>
				</div>
				<el-pagination
					layout="total, sizes, prev, pager, next, jumper"
					:current-page="param.currPage"
					:total="count"
					@size-change="pageSizeChange"
					@current-change="pageIndexChange">
				</el-pagination>
			</div>
			<!-- 试听记录 -->
			<div v-else-if="pageType==1" class="panel" style="margin-top:0.16rem;padding: 0 0.3rem 0.3rem 0.3rem;">
				<auditionRecord ref="auditionRecord"></auditionRecord>
			</div>
			<!-- 考勤记录 -->
			<div v-else-if="pageType==2" class="panel" style="margin-top:0.16rem;padding: 0 0.3rem 0.3rem 0.3rem;">
				<attendRecord ref="attendRecord"></attendRecord>
			</div>

			<!-- 双师-约名师 -->
			<div class="box" v-show="teacherShow">
				<div class="title">
					<span class="box_back" @click="teacherShow = false">{{title}}</span>
					<i class="el-icon-arrow-right"></i>
					<span>约名师</span>
				</div>
				<auditionTeacher ref="auditionTeacher" :orderForeignTeacher="null" @cancel="teacherShow = false" 
					@showOrderForeignSyllabuslist="showOrderForeignComponents">
				</auditionTeacher>
			</div>
			<!-- 双师-班级订单 -->
			<div class="box" v-show="orderShow">
				<div class="title">
					<span class="box_back" @click="orderShow = false">{{title}}</span>
					<i class="el-icon-arrow-right"></i>
					<span>班级订单</span>
				</div>
				<auditionOrder ref="auditionOrder" :orderForeignTeacher="null" @cancel="orderShow = false"
					 @showOrderForeignSyllabuslist="showOrderForeignComponents">
				</auditionOrder>
			</div>
		</div>
		
		<auditionAdd ref="auditionAdd" @callback="closeAdd"></auditionAdd>
		<auditionEdit ref="auditionEdit" @callback="closeEdit"></auditionEdit>
		<auditionAttend ref="auditionAttend" @callback="closeAttend"></auditionAttend>
		<auditionTransfer ref="auditionTransfer" @callback="closeTransfer" @update="updateTransfer"></auditionTransfer>
		<auditionTurnClass ref="auditionTurnClass" @callback="closeTurnClass"></auditionTurnClass>
		<auditionDelete ref="auditionDelete" @callback="closeDelete"></auditionDelete>
		<auditionEnroll ref="auditionEnroll" @callback="closeEnroll"></auditionEnroll>
		<auditionTimetable ref="auditionTimetable" @callback="closeTimetable"></auditionTimetable>
		<auditionClassroom ref="auditionClassroom" @callback="closeClassroom"></auditionClassroom>
		<auditionSyllabus ref="auditionSyllabus" @callback="closeSyllabus"></auditionSyllabus>
		 <!--排课日历-->
		<Schedulecalendar ref="schedulecalendar" @callback="openTeacher"></Schedulecalendar>
	
	</div>
</template>

<script>
	
import auditionAdd from './subpage/audition_add'
import auditionEdit from './subpage/audition_edit'
import auditionAttend from './subpage/audition_attend'
import auditionTransfer from './subpage/audition_transfer'
import auditionTurnClass from './subpage/audition_turn_class'
import auditionDelete from './subpage/audition_delete'
import auditionEnroll from './subpage/audition_enroll'
import auditionTimetable from './subpage/audition_timetable'
import auditionClassroom from './subpage/audition_classroom'
import auditionSyllabus from './subpage/audition_syllabus'
import Schedulecalendar from '../education_manage/common/Schedulecalendar'
import auditionTeacher from '../education_manage/common/orderForeignTeacher'
import auditionOrder from '../education_manage/common/orderForeign_classOrderManage'
import auditionRecord from './subpage/audition_record'
import attendRecord from './subpage/attend_record'
var vm,dict;
export default {
	components : {
		auditionAdd,auditionEdit,auditionAttend,auditionTransfer,auditionTurnClass,
		auditionDelete,auditionEnroll,auditionTimetable,auditionClassroom,
		auditionSyllabus,Schedulecalendar,auditionTeacher,auditionOrder,auditionRecord,
		attendRecord
	},
	data : function() {
		return {
			title : this.$route.name,
			pageType: 0 ,
			param : {
				keyword : "",
				startTime : "",
				endTime : "",
				classroomId : "",
				teachUserId : "",
//				classStatusMode : "",
				campusId : this.$store.state.campusId,
				pageSize : 10,
				currPage : 1,
			},
			//下拉列表数据
			userList : null,
			classroomList : null,
//			classStatus : null,
//			classStatusMap : null,
			statusMap : null,
			signinMap : null,
			courseTypeMap : null,
			
			count : null,
	        classTime: null,
	        auditionList : [],
	        statusColor : {
	        	"1": "#dddedf", //未排课:灰色
	        	"2": "#dddedf", //待上课:灰色
	        	"3": "#20adff", //上课中:蓝色
	        	"4": "#80cc29", //已结课:绿色
	        },
	        teacherShow : false, //名师页面显示
	        orderShow : false, //班级订单显示
		}
	},
	methods : {
		selectType : function(type) {
			vm.pageType = type;
			if(type===1){
				this.$nextTick(d=>{
					this.$refs['auditionRecord'].init();
				});
			}
			else if(type===2){
				this.$nextTick(d=>{
					this.$refs['attendRecord'].init();
				});
			}
		},
		search : function() {
			api.auditionList(vm.param).then(function(data) {
				//赋上这个属性,才会双向绑定
				data.list.forEach(function(item) {
					item.studentList = null;
					//计算时间
					var c = item.nearTrialClassSyllabus || {};
					
					if(c.startTime) {
						c.time = c.startTime+"~"+c.endTime.substring(11);
					}
					c.status = null;
					item.syllabus = c;
				})
				
				vm.auditionList = data.list;
				vm.count = data.totalCount;
				
				vm.setStatus();
			});
			
			//将展开的学生列表收起,列表数据重新加载
			$(".table_div").hide();
			$(".panel_bottom_btn").removeClass("panel_bottom_btn_up");
		},
		setStatus : function() {                   
			var now = tool.DateToString(new Date(), "yyyy-MM-dd HH:mm");
			//遍历试听班级
			vm.auditionList.forEach(function(item) {
				let s = item.syllabus;
				
				//没最近课节,未排课,需求说就叫待上课
				if(s.classSyllabusId == null) {
					s.status = 2;
					
				//最近课节还没开始,待上课
				} else if(now < s.startTime) {
					s.status = 2;
					
				//最近课节已经结束,已结课
				} else if(now >= s.endTime) {
					s.status = 4;
				
				//上课中
				} else {
					s.status = 3;
				}
			})
		},
		campusChange : function(campusId) { //校区改变
			vm.param.campusId = campusId;
			vm.search();
			vm.loadList();

			if(vm.pageType===1){
				this.$nextTick(d=>{
					this.$refs['auditionRecord'].init();
				});
			}
			else if(vm.pageType===2){
				this.$nextTick(d=>{
					this.$refs['attendRecord'].init();
				});
			}
		},
		timeChange : function(time) {
			vm.param.startTime = (time? time[0] + " 00:00:00" : "");
			vm.param.endTime = (time? time[1]+ " 23:59:59" : "");
		},
		showStudent : function(event,audition) {
			
			var $btn = $(event.currentTarget);
			var $table = $btn.prev();
			var s = audition.syllabus;
			
			//未排课,不做任何处理
			if(s.classSyllabusId == null) {
				tool.message({showClose: true, message: "该班级尚未排课", type: 'warning'});
				return;
			}
			
			//学生列表不存在,初次打开,加载
			if(!audition.studentList||audition.studentList.length==0) {
				var param = {
					classId : audition.classId,
					classSyllabusId : s.classSyllabusId
				}
				api.auditionStudent(param).then(function(data) {
					audition.studentList = data.list;
					vm.$nextTick(function(){
			          	slide();
			       	});
				});
			} else {
				slide();
			}
			
			function slide() {
	//			var $table = $(event.currentTarget).parent().next();
				if($table.css("display")=="none") {
					$table.slideDown();
					$btn.addClass("panel_bottom_btn_up");
				} else {
					$table.slideUp();
					$btn.removeClass("panel_bottom_btn_up");
				}
			}
		},
		pageSizeChange : function(val) { //页条数发生改变
	  		vm.param.pageSize = val;
	    	vm.search();
	  	},
	  	pageIndexChange : function(val) { //页码发生改变
	    	vm.param.currPage = val;
	    	vm.search();
	  	},
		openAdd : function() {
			vm.$refs.auditionAdd.init();
		},
		closeAdd : function() {
			vm.search();
		},
		openEdit : function(audition) {
			vm.$refs.auditionEdit.init(audition);
		},
		closeEdit : function() {
			vm.search();
		},
		classScheduling:function(audition){
			//约了名师
			if(audition.feiboSyllabusOrderNum) {
				tool.message({
		            type: 'warning',
		            message: '您已约名师，如重新排课，需要取消已约的名师排课，重新预约！'
		        });
		        return;
			}
			//试听课,不重排
			audition.isTrialClass = 1;
	        audition.isReadjust = 0;
			
			//没有排课,直接去排课
			if(!audition.nearTrialClassSyllabus) {
				vm.$refs.schedulecalendar.init(audition)
				return;
			}
			//已经排课了,确认框
			vm.$confirm('该试听班级已排课', '排课', {
				distinguishCancelAndClose: true,
	          	confirmButtonText: '重新排课',
	          	cancelButtonText: '继续排课',
	          	type: 'warning'
	        }).then(() => {
	        	//重新排课
	        	audition.isReadjust = 1;
	        	vm.$refs.schedulecalendar.init(audition);
	        }).catch( action => {
	        	if(action == "cancel") {
	        		//继续排课
	        		vm.$refs.schedulecalendar.init(audition);
	        	}
	        });
		},
		searchData : function() {
			vm.search();
		},
		selectOverClassData : function() {
			vm.search();
		},
		openAttend : function(audition) {
			if(!audition.nearTrialClassSyllabus) {
				tool.message({showClose: true, message: "该班级当前尚无课节，请先排课", type: 'warning'});
				return;
			}
			//当前没学员,不做任何处理
			if(audition.syllabus.studentNum == 0) {
				tool.message({showClose: true, message: "该班级当前尚无学员，请先报名", type: 'warning'});
				return;
			}
			var now = tool.DateToString(new Date(),"yyyy-MM-dd HH:mm");
			//判断时间到达上课时间
			if(now < audition.syllabus.startTime) {
				tool.message({showClose: true, message: "尚未到上课时间", type: 'warning'});
				return;
			}
			
			
			vm.$refs.auditionAttend.init(tool.clone(audition));
		},
		closeAttend : function(data) {
			vm.search();
		},
		openDelete : function(audition) {
			var s = audition.nearTrialClassSyllabus;
			var now = tool.DateToString(new Date(),"yyyy-MM-dd HH:mm");
			
			//未排课,直接跳转到删除页
			if(!s) {
				vm.$refs.auditionDelete.init(audition);
				return;
			}
			//正在上课中
			if(s.startTime < now && s.endTime > now) {
				tool.message({showClose: true, message: "当前正在上课中，无法删除", type: 'warning'});
				return;
			}
			//已结课,直接跳转到删除页
			if(s.endTime <= now) {
				vm.$refs.auditionDelete.init(audition);
				return;
			}
			
			//异步请求标志和等待框
			var flag = false;
			var loading = tool.loading({text: "", background: "rgba(0,0,0,0)"});
			//课节id数组, 学生数组
			var syllabusIds = [];
			var list = null;
			//查询当前班级的待上课的课节
			var param = { classId : audition.classId, startTime : s.startTime };
			api.auditionSyllabus(param).then(function(data) {
				//保存课节id列表
				data.list.forEach(function(item) {
					syllabusIds.push(item.classSyllabusId);
				});
				if(flag) {
					setStudentList();
				} else {
					flag = true;
				}
			})
			//获取学生列表
			api.auditionStudent({classId : audition.classId}).then(function(data) {
				list = data.list;
				if(flag) {
					setStudentList();
				} else {
					flag = true;
				}
			})
			
			function setStudentList() {
				//关闭等待框
				loading.close();
				//遍历学生列表
				for(let i = 0; i < list.length; i++) {
					let id = list[i].classSyllabusId;
					//学生Id不在有效课节中
					if(syllabusIds.indexOf(id)<0) {
						//删除这个学生
						list.splice(i,1);
						i--;
					}
				}
				//如果没有学生,跳转到删除页
				if(list.length == 0) {
					vm.$refs.auditionDelete.init(audition);
				} else {
					vm.$refs.auditionTransfer.init(audition, list);
				}
			}
		},
		closeDelete : function(data) {
			vm.search();
		},
		closeTransfer : function(audition) {
			vm.$refs.auditionDelete.init(audition);
		},
		updateTransfer : function() {
			vm.search();
		},
		openTurnClass : function(student) {
			vm.$refs.auditionTurnClass.init(student);
		},
		closeTurnClass : function() {
			vm.search();
		},
		openEnroll : function(audition) {
			//获取当前时间和最近课节
			var now = tool.DateToString(new Date(), "yyyy-MM-dd HH:mm");
			var s = audition.nearTrialClassSyllabus;
			//最近课节不存在(未排课)
			if(!s) {
				tool.message({showClose: true, message: "尚未排课，请先排课", type: 'warning'});
				return;
			}
			//最近课节已结束(已结课)
			if(s.endTime < now) {
				tool.message({showClose: true, message: "当前班级已结课", type: 'warning'});
				return;
			}
			vm.$refs.auditionEnroll.init(audition);
		},
		closeEnroll : function() {
			vm.search();
		},
		openTimetable : function(audition) {
			vm.$refs.auditionTimetable.init(audition);
		},
		closeTimetable : function() {
			vm.setStatus();
		},
		openSyllabus : function(audition) {
			//未排课
			if(!audition.nearTrialClassSyllabus) {
				tool.message({type: "warning", message : "尚未排课，请先排课"});
				return;
			}
			//打开课节设置
			vm.$refs.auditionSyllabus.init(audition);
		},
		closeSyllabus : function() {
			
		},
		openClassroom : function(audition) {
			//未排课
			if(!audition.nearTrialClassSyllabus) {
				tool.message({type: "warning", message : "尚未排课，请先排课"});
				return;
			}
			//打开创建教室
			vm.$refs.auditionClassroom.init(audition);
		},
		closeClassroom : function() {
			
		},
		openTeacher : function(id) {
			//根据id找到试听班级对象
			var audition = null;
			vm.auditionList.forEach(function(item) {
				if(item.classId == id) {
					audition = item;
				}
			})
			//未排课
			if(!audition.nearTrialClassSyllabus) {
				tool.message({type: "warning", message : "尚未排课，请先排课"});
				return;
			}
			//获取未约名师的课节
			var param = { classId : audition.classId, unappointedSyllabus : 1 };
			api.auditionSyllabus(param).then(function(data) {
				
				let now = tool.DateToString(new Date(),"yyyy-MM-dd HH:mm");
				let list = [];
				
				data.list.forEach(function(item) {
					if(now <= item.startTime){
    		 	 		list.push(item);		    	 	 		
    		 	 	}
				});
				if(list.length == 0) {
					tool.message({ type: 'warning', message: '没有可约名师的课节' });
					return;
				}
				vm.teacherShow = true;
				vm.$refs.auditionTeacher.initBydata({classObj : audition, courseObj : list});
				$(".home_content").scrollTop(0);
			});
		},
		openOrder : function(audition) {
			vm.orderShow = true;
			vm.$refs.auditionOrder.initBydata(audition);
			$(".home_content").scrollTop(0);
		},
		showOrderForeignComponents : function(data) { //跟约名师,班级订单的回调函数
			vm.teacherShow = data.teacher.visible;
			vm.orderShow = data.classorder.visible;
			
			//显示约名师
			if(vm.teacherShow) {
				vm.$refs.auditionTeacher.initBydata(data.teacher.data);
				$(".home_content").scrollTop(0);
			}
			//显示班级订单
			if(vm.orderShow) {
				vm.openOrder(data.classorder.data);
			}
		},
		loadList : function() {
			var campusId = vm.$store.state.campusId;
			
			//用户列表
			vm.param.teachUserId = "";
			api.userListByCampus({campusId : campusId}).then(function(data) {
				vm.userList = data.userList;
			});
			//教室列表
			vm.param.classroomId = "";
			api.getClassroomList({campusId : campusId}).then(function(data) {
				vm.classroomList = data.info;
			});
		}
	},
	mounted : function() {
		
	},
	created : function() {
		vm = this;
		dict = tool.getItem(lsKey.dict,true);
//		vm.classStatus = dict["class_status_mode"];
		vm.courseTypeMap = tool.parseDict(dict["course_type"]);
		vm.statusMap = tool.parseDict(dict["audition_status"]);
		vm.signinMap = tool.parseDict(dict["signin_mode"]);
		
		vm.search();
		//后台加载下拉列表
		vm.loadList();
		//定时10s更新试听班级状态
		
		const timer = setInterval(function() {
			vm.setStatus();
		},10000)
		
		vm.$once('hook:beforeDestroy', () => {            
		    clearInterval(timer);                                    
		})
		
	}
}
</script>

<style lang="scss">
	#audition_manage {
		.el-input__inner {
			border-radius: 0.08rem;
			font-size: 0.16rem;
			color: #666666;
			height: 0.36rem;
			line-height: 0.36rem;
		}
		.el-input__icon {
			line-height: 0.36rem;
		}
		
		.el-range-editor {
			padding: 0 0.05rem 0 0.1rem;
		}
		.el-range-separator {
			padding: 0 ;
			width : 10% ;
			line-height: 0.34rem;
			color: #666666;
		}
		.el-range-input {
			font-size: 0.16rem;
			color: #666666;
			height: 0.3rem;
		    position: relative;
		    top: 0.01rem;
		}
		.nav_div {
			overflow: hidden;
			padding-left: 0.1rem;
		}
		.nav {
			width: 1.79rem;
			line-height: 0.35rem;
			float: left;
			color: #999999;
			font-size: 0.2rem;
			font-weight: bold;
			text-align: center;
			cursor: pointer;
		}
		.nav_active {
			color: #3885f8;
			border-bottom: 0.03rem solid #3885f8;
		}
	}
</style>
<style scoped src="@/style/module/table.css"></style>
<style scoped src="@/style/clue_manage/audition_manage.css"></style>
<style scoped>
	.table {
		border-top: 0;	
	}
	.right_btn {
		background-image: url(../../assets/img/clue_manage/add_white.png);
	}
</style>